<template>
  
  
  <el-dialog :append-to-body="true" :close-on-click-modal="false" :before-close="cancel" :visible.sync="dialog" :show-close="false" :title="isAdd ? '新增' : '编辑1'" width="1000px">
    <el-form ref="formE"  :model="formE"  :rules="rules" size="small" label-width="140px">
          <el-form-item label="活动Id" v-if="formE.id!=null && formE.id!=''">
            <el-input v-model="formE.id" :disabled="true" style="width: 370px;" />
          </el-form-item>
          <el-form-item label="默认奖品图片">
    
              <MaterialList
                      v-model="formE.imageArrE"
                      style="width: 915px;"
                      type="image"
                      :num="1"
                      :width="150"
                      :height="150"
              />
          </el-form-item>
          <el-form-item label="活动名称">
            <el-input v-model="formE.title" style="width: 800px;" />
          </el-form-item>
          <el-form-item label="活动介绍">
            <el-input :rows="3" v-model="formE.prizeMsg" type="textarea" style="width: 800px;" />
          </el-form-item>
          <el-form-item label="活动规则">
            <el-input :rows="3" v-model="formE.prizeRule" type="textarea" style="width: 800px;" />
          </el-form-item>



          <el-form-item label="活动开始时间" >
            <template>
              <el-date-picker
                v-model="formE.startTime"
                type="datetime"
                placeholder="开始时间" style="width: 380px;"
              />
            </template>
            
          </el-form-item>

           <el-form-item label="活动结束时间" >
          
            <template>
              <el-date-picker
                v-model="formE.endTime"
                type="datetime"
                placeholder="结束时间" style="width: 380px;"
              />
            </template>
          </el-form-item>
       
   
          <!--
            <el-form-item label="状态:0=到期,1=进行中">
              <el-input :rows="3" v-model="formE.status" type="textarea" style="width: 370px;" />
            </el-form-item>
            <el-form-item label="活动状态:0=启用,1=禁用">
                <el-input :rows="3" v-model="formE.isLook" type="textarea" style="width: 370px;" />
            </el-form-item>
          -->
          
          <el-form-item label="每日抽奖次数">
            <el-input-number  v-model="formE.number" style="width: 380px;" />
          </el-form-item>
          <el-form-item label="抽奖消耗积分">
            <el-input-number v-model="formE.integral" style="width: 380px;" />
          </el-form-item>


          <el-form-item label="奖品配置">

            <template>
              <el-table
                :data="formE.tableData"
                style="width: 100%"
                border
                >
                
                <el-table-column type="expand">
                  <template slot-scope="props">
                    <el-form label-position="right" inline class="demo-table-expand" label-width="150px">
                  
                      <el-form-item label="奖品类型">
                        <div v-if="props.row.type==0">积分</div>
                        <div v-if="props.row.type==1">商品</div>
                      </el-form-item>
                      <el-form-item label="奖励积分"  v-if="props.row.type==0">
                        <span>{{ props.row.integral }}</span>
                      </el-form-item>
                      <el-form-item label="奖励商品"  v-if="props.row.type==1">
                        <span>{{ props.row.product_name }}</span>
                      </el-form-item>
                    </el-form>
                  </template>
                </el-table-column>
                <el-table-column
                  label="奖品名称"
                  prop="title">
                </el-table-column>
                <el-table-column
                  label="奖品数量"
                  prop="number">
                </el-table-column>
                <el-table-column
                  label="中奖概率"
                  prop="weight">
                </el-table-column>

                <el-table-column
                  fixed="right"
                  label="操作"
                  width="100">
                  <template slot-scope="scope">
                    <el-button type="text" size="small"  @click="makePrize(scope.row)">设置奖品</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </template>

          </el-form-item>
      
        </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button type="text" @click="cancel">取消</el-button>
      <el-button :loading="loading" type="primary" @click="doSubmit">确认</el-button>
    </div>






          <el-dialog title="设置奖品" :visible.sync="dialogFormVisible" :show-close="false"  :append-to-body="true">
            <el-form :model="setform"   label-width="120px">

            <!--
                    
              <el-form-item label="奖品名称">
                <el-input v-model="setform.title" style="width: 370px;" />
              </el-form-item>
              <el-form-item label="奖品类型">
                  <el-radio v-model="setform.type" :label="1">商品</el-radio>
                  <el-radio v-model="setform.type" :label="0" style="width: 200px;">积分</el-radio>
      
              </el-form-item>
              <el-form-item label="奖励积分" v-if="setform.type==0">
                <el-input-number v-model="setform.integral" style="width: 370px;" />
              </el-form-item>


              <el-form-item label="奖励商品" v-if="setform.type==1">
                  <cgood v-model="form1.good" :disabled="true" @click="is_refresh=!is_refresh"></cgood>
              </el-form-item>
            
            -->
              




            <!--
            
            <el-form-item label="奖励商品" v-if="setform.type==1 &&  setform.image==''">
                  <cgood v-model="form1.good" :disabled="true" @click="is_refresh=!is_refresh"></cgood>
              </el-form-item>



              <el-form-item label="奖励商品" v-if="setform.type==1 &&  setform.image!=''">

                  <div v-if="is_look">
                    <img :src="setform.image"   :width="150"
                        :height="150" 
                        >
                    <el-button type="primary" plain @click="is_look=false" round>更换商品</el-button>
                  </div>
                  <div v-if="!is_look">
                    <cgood v-model="form1.good" :disabled="true" @click="is_refresh=!is_refresh"></cgood>
                  </div>
              </el-form-item>
            -->
              


              <el-form-item label="商品名称" v-if="setform.type==1 ">
                  <el-input v-model="form1.good.storeName" style="width: 370px;" />
              </el-form-item>
              <el-form-item label="奖品数量">
                <el-input-number v-model="setform.number" :min="1"   style="width: 370px;" />
              </el-form-item>
              <el-form-item label="中奖概率">
                <el-input-number v-model="setform.weight" :min="0.01" :max="1"  style="width: 370px;" />
              </el-form-item>
            </el-form>
      
            <div slot="footer" class="dialog-footer">
              <el-button @click="dialogFormVisible = false" >取 消</el-button>
              <el-button type="primary"   @click="makePrizeSure()">确 定</el-button>
            </div>
          </el-dialog>

  </el-dialog>

     







</template>

<script>
import cgood from '@/views/components/good'
import { add, edit } from '@/api/yxSystemPrize'
import editor from '../../components/Editor'
import MaterialList from '@/components/material'
import singlePic from '@/components/singlematerial'
import { getInfo } from '@/api/yxStoreProduct'
export default {
  components: { editor, MaterialList,cgood,singlePic },
  props: {
    isAdd: {
      type: Boolean,
      required: true
    }
  },
  data() {
    return {
      is_refresh:true,
      is_look:true,
      imageArrE:[],
      loading: false, dialog: false,
      templateList: [],
      form1: {
        good:{
          productId: null,
          storeName: null,
          image: null
        }
      },
      formE: {
        id:'',
        image:'',
        title:'',
        prizeMsg:'',
        prizeRule:'',
        startTime:'',
        endTime:'',
        number:0,
        integral:0,
        imageArrE:[],
        tableData:[
        ]
      },
      dialogFormVisible: false,
      setform:{},
      rules: {
      }
    }
  },
  watch: {
  
  },
  methods: {
    mounted(){
      console.log(111111)
      this.imageArrE.push(this.formE.image)
    },

    cancelPrize(){
      this.dialogFormVisible = false;
      this.form1.good={};
    },
    cancel() {
      this.resetForm();
      this.form1.good={};
    },
    doSubmit() {
      this.loading = true
      console.log("执行修改")
      this.doEdit()
    },
    doEdit() {
      
      var form = {
        id:this.formE.id,
        image:this.formE.imageArrE[0],
        title:this.formE.title,
        prizeMsg:this.formE.prizeMsg,
        prizeRule:this.formE.prizeRule,
        startTime:this.formE.startTime,
        endTime:this.formE.endTime,
        number:this.formE.number,
        integral:this.formE.integral,
        tableData:this.formE.tableData
      }


      edit(form).then(res => {
        this.resetForm()
        this.$notify({
          title: '修改成功',
          type: 'success',
          duration: 2500
        })
        this.loading = false
        this.$parent.init()
      }).catch(err => {
        this.loading = false
        console.log(err.response.data.message)
      })
    },
    resetForm() {
      this.dialog = false
      this.formE = {
        id:'',
        image:'',
        title:'',
        prizeMsg:'',
        prizeRule:'',
        startTime:'',
        endTime:'',
        number:0,
        integral:0,
        imageArrE:[],
        tableData:[
        ]
      }
    },
    makePrize(data){
        this.dialogFormVisible = true;
        this.setform = data
        if(data.product_id>0){
          console.log("当前行数据的商品id")
          console.log(data.product_id)
          this.form1.good.productId = data.product_id;
          this.form1.good.image = data.image;
          this.form1.good.storeName = data.product_name;
        }
    },
    makePrizeSure(){
      this.dialogFormVisible = false;
      for(let i = 0;i<this.formE.tableData.length;i++){
        if(this.formE.tableData[i].id==this.setform.id){
            this.formE.tableData[i].type = this.setform.type;
            this.formE.tableData[i].number = this.setform.number;
            this.formE.tableData[i].weight = this.setform.weight;
        }
      }
      this.form1.good={};
    }
  }
}
</script>

<style scoped>

</style>
